<template>
    <div class="welcome-container">
        <div class="content">
            <div class="subtitle">欢迎体验</div>
            <div class="title">素晰通用后台管理系统</div>
            <div class="desc">- Vue3.0+ElementPlus+Node+Mongo打造通用后台管理系统</div>
        </div>
        <div class="img"></div>
    </div>
<!--    <router-link :to="{ name: 'about' }">about</router-link>-->
</template>

<script>
    export default {
        name: "WelcomeView"
    }
</script>
<!--<script setup>-->
<!--    import { onMounted, getCurrentInstance } from 'vue'-->
<!--    import storage from "../utils/storage";-->
<!--    const { $request } = getCurrentInstance().appContext.config.globalProperties-->
<!--    // console.log(getCurrentInstance())-->
<!--    onMounted(() => {-->
<!--        // 写法1-->
<!--        // $request({-->
<!--        //     method: 'get',-->
<!--        //     url: '/user',-->
<!--        //     data: {-->
<!--        //         id: 1-->
<!--        //     }-->
<!--        // }).then(res => {-->
<!--        //     console.log(res)-->
<!--        // })-->
<!--        // $request.get('/user', { id: 1 }).then(res => {-->
<!--        //     console.log(res)-->
<!--        // })-->
<!--        // storage.setItem('userInfo', { name: 'doria', age:12})-->
<!--        // storage.setItem('name', 'doria')-->
<!--        // console.log(storage.getItem('name'))-->
<!--        // storage.removeItem('currentId')-->
<!--        // storage.clearAll()-->
<!--    })-->
<!--</script>-->
<style scoped lang="scss">
.welcome-container{
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    background: #ffffff;
    .content{
        position: relative;
        bottom: 40px;
        .subtitle{
            font-size: 30px;
            line-height: 40px;
            color: #000;
        }
        .title {
            font-size: 40px;
            line-height: 60px;
            color: #2986EB;
        }
        .desc{
            font-size: 14px;
            color: #999;
            text-align: right;
        }
    }
    .img{
        width: 371px;
        height: 438px;
        background: url("../assets/images/welcome.png");
        margin-left: 86px;
    }
}
</style>
